<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/spxx.css" type="text/css" rel="stylesheet" />
<link href="css/login.css" type="text/css" rel="stylesheet" />
<link href="css/jquery-ui.css" type="text/css" rel="stylesheet" />
<script src="js/jquery-1.5.1.min.js" type="text/javascript"></script>

<script>




$(document).ready(function(){
	intiMethod();
	intiGwctck();
	intiSpzstp();
	loginDigBind();
	});
	
	function intiMethod(){

		var tagObj=$("#tag1");
		tagObj.removeClass("tagnoClick");
		tagObj.addClass("tagnoClickafter");	
		}
	
	//这个是商品信息转有的
	function intiGwctck(){
		$("#gwctc").hide();
		$("#tckzd").hide();
	}
	function intiSpzstp(){
    	var imgUrl=$("#spxx_tp_0").attr("src");
    	
    	$("#imgaaatest").attr("src",imgUrl);
	}


	function clickSize(xhid,kcsl){
		var spxhnr=$("#sizenr_"+xhid);

		$("#yhxz").text("\""+spxhnr.text()+"\"");
		$("#kcsl").text(kcsl);
		//遍历标签
		$("#ncmListUl>li>a>span").each(function(index){
			var obj=this;
			if(this.id!=("sizenr_"+xhid)&&$(this).hasClass("cmyjxz")){
				$(this).removeClass("cmyjxz");
			}
		});
		spxhnr.addClass("cmyjxz");
		
	}


    function tagClick(num){
		var tagObj=$("#tag"+num);
		var tagxxObj=$("#spxx_tag"+num);
		for(var i=1 ;i<4; i++)
		{
			if($("#tag"+i).hasClass("tagnoClickafter"))
			{
				$("#tag"+i).removeClass("tagnoClickafter");
				$("#tag"+i).addClass("tagnoClick");
			}
		}
		
		//以下为实现 标签互换的
		if(num==1){
            for(var i=1 ;i<4; i++){
			   if($("#spxx_tag"+i).hasClass("hideclass")){
				   $("#spxx_tag"+i).removeClass("hideclass");
			    }
			}
		}
		if(num==2){
		    if($("#spxx_tag2").hasClass("hideclass")){
			      $("#spxx_tag2").removeClass("hideclass");
			}
			 $("#spxx_tag1").addClass("hideclass");
			 $("#spxx_tag3").addClass("hideclass");
		}
		if(num==3){
		 	if($("#spxx_tag3").hasClass("hideclass")){
			      $("#spxx_tag3").removeClass("hideclass");
			}
			 $("#spxx_tag1").addClass("hideclass");
			 $("#spxx_tag2").addClass("hideclass");
		}
			tagObj.removeClass("tagnoClick");
			tagObj.addClass("tagnoClickafter");	
	}
    function clickButtonAdd(){
    	var spgmsl=$("#spgmsl").val();
    	spgmsl=parseInt(spgmsl)+1;
    	$("#spgmsl").val(spgmsl);
    }
    function clickButtonlower(){
    	var spgmsl=$("#spgmsl").val();
    	if(spgmsl>=2){
        	spgmsl=parseInt(spgmsl)-1;
        	$("#spgmsl").val(spgmsl);
    	}
    }
    //加入购物车
    function addGwc(){
    	var yhxxid="${yhxxSession.yhxxid}";
    	var spxxid="${spxxid}";
    	var spxhid="";
    	var spsl=$("#spgmsl").val();
		$("#ncmListUl>li>a>span").each(function(index){
			var obj=this.id;
			if($(this).hasClass("cmyjxz")){
				spxhid=obj.substring(7,obj.length);
			}
		});

		if(yhxxid.trim()==""){
			alert("请先登录");
			return false;
		}
		if(spxhid==""){
			alert("请选择尺码");
			return false;
		}
		
		 $.ajax({
			    url: "saveGwcxx.action",
			    type: "post",
			    data: "yhxxid="+yhxxid+"&spxxid="+spxxid+"&spxhid="+spxhid+"&spsl="+spsl,
			    datetype: "json",
			    success: function(date) {
			    	var flag=date.flag;
			    	if(flag=="0"){
			    		alert("添加失败");
			    	}
			    	if(flag=="1"){
			    	   $("#gwctc").show();
			    	   $("#tckzd").show();
			    	}
			    	
			     }
			 });
		//Ajax添加至购物车中
    }
    //图片区 鼠标放在上边时候 执行该函数
    function picOnmouse(id){
    	var imgUrl=$("#spxx_tp_"+id).attr("src");
    	
    	$("#imgaaatest").attr("src",imgUrl);
    }
</script>
<title>无标题文档</title>
</head>

<body>
<div class="container"><!--全体-->
<jsp:include page="header.jsp" flush="true" />
   <!--<div class="clearBox10px"></div>  这是用给首页用的-->
   <div class="Navigation">
   <span style="float:left; font-size:12px;">您当前的位置：</span><span style="float:left; font-size:12px;">二鞋库</span><span style="float:left; font-size:12px;">男鞋</span>
   </div>
   <div class="clearclear"></div><!--清理一下-->
   <div id="main"><!--main--> 
       <div class="spxx_up">  <!--上部分-->
          <table width="100%">
          <tbody>
           <tr>
              <td width="480">
              <div class="spxx_pic">
                <a href="#"><img src="images\sp\dat.jpg" id="imgaaatest" onclick="picOnmouse()"></a>
              </div>
              
              <table class="spxx_pic_box_border">
                <tbody>
                  <tr>
                  <s:iterator value="spxx.listZstp" id="zstpStr" status="list">
                   <td><a href="#" onmouseover="picOnmouse(<s:property value="#list.index" />)"><img id="spxx_tp_<s:property value="#list.index" />" class="spxx_pic_box" src="<s:property value="#zstpStr" />" /></a></td>
                  </s:iterator>
                  </tr>
                </tbody>
              </table>
           
              </td>
              <td valign="top">
              <table cellpadding="0" cellspacing="0" width="100%"  >
                <tbody>
                  <tr>
                   <td height="30">
                     <h1 class="spxx_goodsname"style="text-align:left;line-height: 150%; color: rgb(51, 51, 51); display: block; ">${spxx.spbt}</h1>
                   </td>
                   <td  class="spxx_goodsname" style="text-align:right">
                      更多产品
                   </td>
                  </tr>
                </tbody>
              </table>
              <ul>
              <li class="spxx_xsjg"><span>市&nbsp;场&nbsp;价：</span><i class="spxx_scjg">￥${spxx.spyj } </i></li>
              <li class="spxx_xsjg">销&nbsp;售&nbsp;价：<b class="spxx_xsjgfont">￥${spxx.spsj }</b></li>
              <li class="spxx_xsjg">运&nbsp;&nbsp;&nbsp;费：<span>会员全场满50元免运费</span></li>
              </ul>
              <div class="spxx_highline"><!--加入购物车块-->
                  <div class="spxx_highbox">
                     <table width="100%">
                        <tbody>
                           <tr>
                             <td style="text-align:left" height="50">你已选择：<span id="yhxz" style="color:#FF0000;font-weight:bold;"></span></td>
                             <td style="text-align:right">没有我需要的尺码？</td>
                           </tr>
                        </tbody>
                     </table>
                     <table width="100%">
                       <tbody>
                         <tr>
                           <td style="text-align:left;" height="20" width="50">颜色：</td>
                           <td></td>
                         </tr>
                         <tr>
                           <td style="text-align:left;" height="50">尺码：</td>
                           <td class="ListKongzhi">
                           <ul style="float:left;" id="ncmListUl">
                           <s:iterator value="lstkcxx">
                             <li><a class="cmyjxzz" onclick="clickSize(<s:property value="xhid" />,<s:property value="kcsl" />)" href="#"><span id="sizenr_<s:property value="xhid" />"><s:property value="spxhnr" /></span></a></li>
                           </s:iterator>
                           </ul>
                           
                           </td>
                         </tr>
                       </tbody>
                     </table>
                     <div class="buyinfo">
                      <table width="100%">
                       <tr>
                         <td style="text-align:left" height="20" width="60">购买数量：</td>
                         <td style="text-align:left;">
                          <div class="NumInput">
            				<input type="text" style="width:20px; float:left;" value="1" id="spgmsl"/> 
            				<div class="button">
             			    <div class="buttonup" onclick="clickButtonAdd()"></div>
              				<div class="buttondown" onclick="clickButtonlower()"></div>
            				</div>
          				 </div> 
          				 <span>库存(<span id="kcsl"></span>件)</span>
						</td>
                       </tr>
                     </table>
                     </div>
                     <div class="joingwc">
                       <input name=" " onclick="addGwc()" type="submit" class="btn-buy" id=" " value=" "  style="cursor:pointer; border:none" />                    
                     </div>
                </div>
              
              </div><!--加入购物车块end-->
              </td>
            </tr>
          </tbody>
          </table>
       </div><!--上部分end-->
        <div class="clearquanti2"></div>
       <div clsss="spxx_downbf"><!--下部分-->
           <div class="TagsSt">
               <ul>
                 <li class="tagnoClick" id="tag1" onclick="tagClick(1)">商品信息</li>
                 <li class="tagnoClick" id="tag2" onclick="tagClick(2)">销售记录</li>
                 <li class="tagnoClick" id="tag3" onclick="tagClick(3)">商品评论</li>
               </ul>
           </div>
           <div class="spxx_tagdown_clear"></div>
           <div class="spxx_canshu">
              <ul>
                <li><span>商品重量：</span><span>null500,000</span>克(g)</li>
                <li><span>货号：</span><span>${spxx.sphh}</span></li>
                <li><span>品&nbsp;&nbsp;牌：</span>${spxx.spppm }</li>
                <li><span>配色：</span><span>null冰露灰+绿 </span></li>
                <li><span>款式：</span><span>${spxx.spks } </span></li>
                <li><span>帮面材质：</span><span>null牛二层皮+合成革</span></li>
                <li><span>大底材质：</span><span>null橡胶</span></li>
              </ul>
           </div>
           <div style="clear:both;"></div>
           <div class="spmsbf" id="spxx_tag1"><!--商品描述部分-->
              <table>
                <tbody>
                  <tr>
                    <td style="width:150px; text-align:right">产地：</td>
                    <td style=" padding-left:5px;">中国</td>
                  </tr>
                  <tr>
                    <td style="text-align:right">材质描述及特点介绍：</td>
                    <td style=" padding-left:5px; padding-bottom:5px; padding-top:5px;">Air Jordan 9 Retro 2010 白卡兰   白色搭配经典的天蓝色总能给人无比美妙的视觉享受。而今年又恰逢Air Jordan系列的25岁生日，Air Jordan IX的转世新生也引起了许多人的关注，虽然Air Jordan IX并没有被乔丹本人在比赛中穿着过，但作为这个经典家族的一员，它还是受到一部分乔迷的喜爱。此次的复刻版本原汁原味的再次呈现了这款与乔丹本人第一次退役有着紧密联系的战靴</td>
                  </tr>
                  <tr>
                    <td style="text-align:right">试穿建议：</td>
                    <td style=" padding-left:5px;">按品牌正常码购买</td>
                  </tr>
                </tbody>
              </table>
              <s:iterator value="spxx.listSpms" id="spxxinfo_spmsstr" >
             	<div style="float:left;margin-bottom:20px;"><img src="<s:property value="#spxxinfo_spmsstr" />"/></div>
             </s:iterator> 
           </div><!--商品描述部分end-->
           
           <div style="clear:both;"></div>
           <div class="spxsjl" id="spxx_tag2"><!--商品销售记录-->
             <div class="spxsjltit"><!--商品销售记录title-->
             <span>销售记录</span>
             </div><!--商品销售记录title end-->
              <s:iterator value="lstgmjl">
             <table>
               <thead>
                 <tr>
                    <td>买家</td>
                    <td>购买数量</td>
                    <td>购买时间</td>
                 </tr>
               </thead>
               <tbody>
                 <tr>
                  <td><s:property value="email" /></td>
                  <td><s:property value="gmsl" /></td>
                  <td>2011-11-1</td>
                 </tr>
                 
               </tbody>
             </table>
             <div style="text-align:left; float:left; margin-top:10px; width:980px; height:30px; line-height:30px;">
             截至今日， 累计成交762笔，查看更多...
             </div>
              </s:iterator>
           </div><!--商品销售记录end-->
           <div style="clear:both;"></div>
           <div class="spgmpl" id="spxx_tag3"><!--商品评论-->
             <div class="spgmplTit"><!--商品评论title-->
                商品评论
             </div><!--商品评论titleend-->
              <s:iterator value="lstgmpj">
             <div class="spgmplnr"><!--商品评论内容-->
                <div class="spgmpl_yhxx"><!--用户信息-->
                   <ul>
                     <li><img src="images/yhxx/0f0ca266bb652cbb.png" /></li>
                     <li><s:property value="email" /></li>
                     <li>VIP会员</li>
                   </ul>
                </div><!--用户信息end-->
                <div class="spgmpl_content">
                   <p style="margin:15px;"><s:property value="pjnr" /></p> 
                </div>
             </div><!--商品评论内容end-->
             <div style="clear:both;"></div>
             </s:iterator>
       </div><!--下部分end-->
       
       <!-- 弹出框 -->
       <script>
        function GwctckClose(){//关闭
        	$("#gwctc").hide();
            $("#tckzd").hide();
        	window.location.reload();
        }
        function ClickLjjs(){	
        	window.location=encodeURI("listGwcxx.action");
        }
       </script>
       <div id="gwctc" class="gwctc"><!--加入购物车成功之后弹窗-->
   <div class="topnav">
     <a href="#" onclick="GwctckClose()">关闭</a>
   </div>
   <div class="cengter">
     <img src="images/buy.jpg"/>您选购的商品已经添加到购物车中
   </div>
   <div class="gwctc_bottom">
   <a href="#" style="margin-left:-130px; font-size:13px; margin-bottom:-10px" onclick="GwctckClose()">继续购物</a>
   <input onclick="ClickLjjs()" type="button" value="立即结算" class="buyBtn" />
   </div>
</div>
<div onclick="GwctckClose()" id="tckzd" style="position: absolute; background-color: rgb(51, 51, 51); z-index: 4200; width: 100%; height: 1000px; top: 0px; left: 0px; visibility: visible; opacity: 0.5;">&nbsp;</div>
<!--弹出框end -->

     <jsp:include page="login.jsp" flush="true" />
     <jsp:include page="reg.jsp" flush="true" />
         <div class="clearquanti"></div>
   
   <div class="footer"></div>
   </div><!--main end-->
   
   
  
   
   

</div><!--全体end-->

</body>
</html>
